/*
 * @: 组件
 * @Version: 1.0
 * @Autor: ziwei
 * @Date: 2021-11-01 18:54:44
 * @LastEditors: ziwei
 * @LastEditTime: 2021-11-01 23:34:54
 * <Provide store={store}>
 *   <ConnectedRouter history={history}>
 *      <ul>
      * <li>
      * <Link to="/" exact={true}>首页</Link></li>
      * </li>
 *      </ul>
 *   </ConnectedRouter>
 * </Provide>
 */
import React, { Component } from 'react'
import {Router} from 'react-router'
import { LOCATION_CHANGE } from './connectRouter'
//import {ReactReduxContext} from 'react-redux'  这个方可能会改 尽量不要用内部变量
import { connect } from 'react-redux'
export default class connectRouter extends Component {
  //static contextType = ReactReduxContext;
  constructor(props,context){
    super(props)
    this.unlisten = this.props.history.unlisten((location,action)=>{
      context.store.dispatch({
        type:LOCATION_CHANGE,
        payload:{location,action}
      })
    })
  }
  componentWillUnmount(){
    this.unlisten();
  }
  render() {
    return (
      <Router history={this.props.history}>
        {this.props.children}
      </Router>
    )
  }
}
let mapDispatchToProps = dispatch =>({
  onLocationChanged:()=>{
    dispatch({
      type:LOCATION_CHANGE,
      payload:{location,action}
    })
  }
})
export default connnect(null,mapDispatchToProps)(connectRouter);


